<template>
    <el-dialog v-model="visible" :title="title" :width="width" @close="resetForm" @open="init" :close-on-press-escape="false">
        <el-form label-width="70px" label-position="left">
            <el-button :icon="Search" @click="searchResume"/>
            <el-form-item label="员工姓名">
                <el-input v-model="empForm.empName"/>
            </el-form-item>
            <el-form-item label="联系电话">
                <el-input v-model="empForm.phone"/>
            </el-form-item>
            <el-form-item label="定岗岗位">
                <el-input v-model="empForm.positionId"/>
            </el-form-item>
            <el-form-item label="所在部门">
                <el-input v-model="empForm.deptId"/>
            </el-form-item>
            <el-form-item label="上级">
                <el-input v-model="empForm.superiorId"/>
            </el-form-item>
        </el-form>
        <template #footer>
            <el-button type="default" @click="visible=false">取消</el-button>
            <template v-if="type===0">
                <el-button type="primary" @click="submitAdd">确认新增</el-button>
            </template>
            <template v-else>
                <el-button type="primary" @click="submitUpdate">确认修改</el-button>
            </template>
        </template>
    </el-dialog>
</template>

<script>
import {ElMessage} from "element-plus";
import {Search} from '@element-plus/icons-vue'

export default {
    name: "EmpForm",
    emits:['refresh-data'],
    setup(){
        return{
            Search
        }
    },
    props:{
        width: ''
    },
    data(){
        return{
            type: 0,//0为添加表单，1为修改表单
            title: '',//表单名称
            visible: false,//是否展示
            empForm:{
                empName: null,
                resumeId: null,
                deptId: null,
                rankId: null,
                positionId: null,
                superiorId: null,
                phone: null
            }
        }
    },
    methods:{
        async submitAdd(){
            if(!this.checkFormParams()){
                ElMessage.error('账户验证失败');
                return;
            }
            this.$emit('refresh-data')//刷新数据表格
            this.visible = false;
        },
        async submitUpdate(){
            if(!this.checkFormParams()){
                ElMessage.error('账户验证失败');
                return;
            }
            this.$emit('refresh-data');
            this.visible = false;
        },
        searchResume(){

        },
        resetForm(){
            Object.assign(this.$data, this.$options.data.call(this));
        },
        checkFormParams(){
            return true;
        },
        init(){

        }
    },
    created() {
        this.init();
    }
}
</script>

<style scoped>
.el-select-dropdown__item{
    width: 100%;
}
.el-cascader-node{
    width: 100%;
}
.explain{
    font-size: 12px;
    color: #a1a1a1;
}
</style>
<style>
.el-cascader-node{
    width: 100%;
}
.el-scrollbar__view{
    width: 180px;
}
</style>